<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<!DOCTYPE html>
<html>
    <head>
        <%@ include file="/commons/basejs.jsp" %>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>主页</title>
        <script type="text/javascript">
            var checkedNode; //被检查节点
            $(function() {
                $('#mul').combotree({
                    url : '${path }/combotree.json',
                    multiple: true,
                    parentField : 'pid',
                    lines : true,
                    panelHeight : 'auto'
                });
                $('#mul1').combotree({
                    url : '${path }/combotree.json',
                    multiple: true,
                    onlyLeafCheck:true,
                    cascadeCheck : false,
                    parentField : 'pid',
                    lines : true,
                    panelHeight : 'auto'
                });

                $('#add').combotree({
                    url : '${path }/combotree.json',
                    parentField : 'pid',
                    lines : true,
                    panelHeight : 'auto'
                });
                $('#update').combotree({
                    url : '${path }/combotree.json',
                    parentField : 'pid',
                    lines : true,
                    panelHeight : 'auto',
                    value : '223',
                    onBeforeSelect: function(node) {
                        if (!$(this).tree('isLeaf', node.target)) {
                            alert("必须选择叶子节点");
                            return false;
                        }
                    },
                    onClick: function(node) {
                        if (!$(this).tree('isLeaf', node.target)) {

                        }
                    }
                });
            });
            
            function selectOne() {
                $("#add").combotree('setValue',223);
            }
            function get1() {
                alert($("#add").combotree('getValue'));
                alert($("#add").combotree('getText'));
            }

            function selectMore() {
                $("#mul").combotree('setValues',[223,227]);
            }
            function get2() {
                alert($("#mul").combotree('getValues'));
                alert($("#mul").combotree('getText'));
            }

            function selectMore1() {
                $("#mul1").combotree('setValues',[222,223,227]);
            }
            function get21() {
                alert($("#mul1").combotree('getValues'));
                alert($("#mul1").combotree('getText'));
            }
        </script>

        <style type="text/css">
            div{
                width:100%;
            }
        </style>
    </head>
    <body>
    combotreeMultiple:
        <select id="mul" name="mul" style="width: 200px; height: 29px;"></select>
        &nbsp;&nbsp;&nbsp;<button onclick="selectMore();">选择223和227</button>
        &nbsp;&nbsp;&nbsp;<button onclick="get2();">获取值</button>
        <br/><br/><br/>

    自定义级联combotreeMultiple:
    <select id="mul1" name="mul1" style="width: 200px; height: 29px;"></select>
    &nbsp;&nbsp;&nbsp;<button onclick="selectMore1();">选择222/223和227</button>
    &nbsp;&nbsp;&nbsp;<button onclick="get21();">获取值</button>
    <br/><br/><br/>


    combotree1:
        <select id="add" name="add" style="width: 200px; height: 29px;"></select>
        &nbsp;&nbsp;&nbsp;<button onclick="selectOne();">选择223</button>
        &nbsp;&nbsp;&nbsp;<button onclick="get1();">获取值</button>
        <br/><br/><br/>

    combotree必须选择叶子节点:
        <select id="update" name="update" style="width: 200px; height: 29px;"></select>
        <br/><br/><br/>

    </body>
</html>

</body>
